This is a very cool effect that we are starting to
see a lot in Flash. It's limitations are endless. Below you will see
how to add gravity to Flash using a mouse chaser. The spinner follows your
mouse according to how fast your move your mouse in a direction. Very
cool!
TUTORIAL
Note: Since this is an advanced tutorial,
there won't be many screenshots, as you should already know how to do most of
the work. This lesson will provide you with the code you need to know and
the concept to make gravity work.
Screenshot of the frames you will be creating in this
tutorial:
Create a new movie in Flash
Create a new button symbol (insert > new
symbol) Call this button Drag.
In the hit, or fourth frame, of the button image
draw a small circle. It should be centered at the middle of the
button.
In the first frame of the main scene, place this
button in the middle of the scene. Because there is nothing on the Up, Over or
Down frames of the button, Flash will display this button as a shaded
object.
With the button selected, convert it to a movie
clip symbol (insert > convert to symbol) name the symbol
drg1.
Give the symbol an instance name (modify >
instance) (I named mine drg1).
Create an action for the frame with the script:
Start Drag ("/drg1", lockcenter). This centers the invisible button at
the center of the mouse when the movie starts playing.
Create a new layer, let's call it
'Spinner'.
Create the symbol that you wish to react to the
mouse in the third frame of this layer. For this tutorial I have made the
pin-wheel spinner. I called it Spinner.
Give the symbol an instance name (modify >
instance) (I named mine spin1).
Create a new layer, let's call it 'Action
Layer'.
In the third frame of the Action Layer, create a
new Movie Clip Symbol (insert > new symbol). Name this movie clip
'action'.
Open this Movie Clip for editing. Create an action
in the first frame.
In a nut shell this is what the script
does:
Where is the Mouse?
Where is the Spinner?
How far apart are they?
How fast should the Spinner move?
Move the Spinner.
That all seems pretty simple, but converting
those commands into Flash's scripting is a little confusing at best. We will
take things step by step.
NOTE: When setting
variables in flash you have String Literal and Expression . These are VERY important. I would seriously
suggest downloading the .fla
with this tutorial and paying CLOSE attention to where he uses string
& expression statements. Otherwise it won't
work!
Where is the Mouse?
To find the mouse we need to get the x and y
properties of the invisible button we made and called drg1. Because we
want to remember this information we will assign variables to both the x
and y coordinates as such: Set Variable: "thisX" = GetProperty (
"/drg1", _x ) Set Variable: "thisY" = GetProperty ( "/drg1",
_y )
Where is the Spinner?
Finding the spinner is identical to finding
the mouse, but now we are looking for the x and y coordinates of the
instance named spin1: Set Variable: "spX" = GetProperty (
"/spin1", _x ) Set Variable: "spY" = GetProperty ( "/spin1",
_y )
How far apart are they?
Remember sleeping through math in High
School? This is what you missed. To find the distance of two points on a
grid you employ the distance formula.
distance^2 = (X2 -
X1)^2 + (Y2 - Y1)^2
Now we are not that concerned with
figuring the exact distance, so we are going to use a simplified version
of the formula and again save the results as variables: Set
Variable: "difX" = thisX - spX Set Variable: "difY" = thisY -
spY
How fast should the Spinner
move?
This questions is a bit misleading, it
should be 'How far should the Spinner move?', as the speed of the
Spinner is defined by the size of steps it takes. To get this
information we divide the dif* variables by a set number (The smaller
the number the faster it moves. For this example I have used 25, however
you should try different speeds to see what you like.): Set
Variable: "xStp" = difX / 25 Set Variable: "yStp" = difY /
25
How fast should the Spinner
move?
This questions is a bit misleading, it
should be 'How far should the Spinner move?', as the speed of the
Spinner is defined by the size of steps it takes. To get this
information we devide the dif* variables by a set number (The smaller
the number the faster it moves. For this example I have used 25, however
you should try different speeds to see what you like.): Set
Variable: "xStp" = difX / 25 Set Variable: "yStp" = difY /
25
Move the Spinner.
All that code above now gets put into
action. These two lines tell the Spinner to reposition itself to a new
set of cordinates. We do this by setting the properties of the names
instance spin1: Set Property ("/spin1", X Position) = spX +
xStp Set Property ("/spin1", Y Position) = spY +
yStp
Add a second layer to the action movie clip, and a
second frame to both layers.
Insert a blank key frame in the second frame of
the second layer.
Either repeat all the scripting from step 13, or
copy the actions from the first frame of the first layer (where all that
scripting went) and paste it into the second frame of the second layer (edit
> copy frames) then (edit > paste frames). Here is a screen shot of
the Action movie clip:
Return to the main scene and add a stop action to
the third frame on the Action Layer. Make sure that your Action movie clip is
in the third frame of this scene.
and Expression 
. These are VERY important. I would seriously
suggest downloading the .fla
with this tutorial and paying CLOSE attention to where he uses string
& expression statements. Otherwise it won't
work!
